<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('超限记录列表')" />
	<th:block th:include="include :: layout-latest-css" />
	<th:block th:include="include :: ztree-css" />
	<style type="text/css">
		.table {table-layout:fixed;}
	</style>
</head>
<body>
	<div class="container-fluid">
		<div class="panel panel-default" >
			<div class="panel panel-head" style="margin-top: 15px">
				<div class="col-xs-1">
					<label for="file"class="btn btn-info">上传svg文件</label>
					<input id="file" type="file" style="display:none" onchange="jsReadFiles(this.files)"/>
				</div>
				<div class="col-xs-5">
					<button onclick="as()" class="btn btn-success">转化</button>
				</div>
			</div>
			<div class="panel panel-body">
				<div id="id1" style="width: 100%;height: 650px" ></div>
			</div>
		</div>
	</div>
	<th:block th:include="include :: footer" />
	<th:block th:include="include :: layout-latest-js" />
        
<script type="text/javascript" language="javascript">

var fileName = '';
function jsReadFiles(files) {
  if (files.length) {
	  // 获取文件绝对路径
	  var filePath = $("#file").val();
	  // 获取.的位置
	  var index = filePath.lastIndexOf(".");
	  // 获取文件后缀名
	  var ext = filePath.substring(index,filePath.length).toLowerCase();
	  if (".svg" != ext) {
		  $('#id1').empty();
		  showErrorMessage("请上传由PBBook转化后的svg文件!");
		  return false;
	  }
	  
      var file = files[0];
      fileName = file.name;
      var reader = new FileReader();
      reader.onload = function() {
          $('#id1').html(this.result);
      }
      reader.readAsText(file);
  }
}        
</script>

<script type="text/javascript">

  function as(){
	if ($("#id1").html().length == 0) {
		showErrorMessage("请上传svg文件后再转化!");
		return false;
	}
	  
        	
    var $svgDiv = $('#id1');
        	
    //后期（小阮）添加 清空内容，并添加js
	$('defs').empty();
	var svg = document.getElementById("id1").children[0];
    //svg.setAttribute("viewBox", "0 0 4100 2100");    	
	
    $('pb\\:dataset').remove();
    $('desc').remove();
	
	//后期（小阮）添加
	$('pb\\:trendlogical').remove();
    $('pb\\:refreshdata').remove();
	
    $svgDiv.find('script').remove();
    $svgDiv.find('svg:first').attr('xmlns', "http://www.w3.org/2000/svg")
    	.attr("preserveAspectRatio", "xMinYMin meet")
    	.attr('version', "1.0").attr("id", "svgId");
    $('rect,g,polygon,line,polyline,text,path').each(function(i, item){
    	$(item).attr('pbtype', $(item).attr('pb:type'))	// pb类型
    		.attr('pbdpttagname', $(item).attr('pbd:pttagname'))	//测点名
    		.attr('pbismultistate', $(item).attr('pb:ismultistate'));	// 是否状态
    });
	
	//后期（小阮）添加，添加测点值保留小数的位数
	$("g[pbtype='7']").each(function(i, item){
			//分割Pi地址和测点
			var temp = $(item).attr('PB:NumberFormat');
			//给测点的文本域添加pi地址和测点名标识,添加点击事件和onmouseover事件
			$(item).find('text').attr('pbnumberformat',temp);
		
	});
	
	$("a").each(function(i,item) {
		var temp = $(item).attr('xlink:href');
		$(item).attr('href','javascript:jump(\''+temp+'\')')
	})
	
	$svgDiv.find("g[id^='Bar']").each(function(i,item) {
		$(item).attr('pblower',$(item).attr('PB:Lower'))
			.attr('pbupper',$(item).attr('PB:Upper'))
			.attr('pbstart',$(item).attr('PB:Start'))
			.attr('pborientation',$(item).attr('PB:Orientation'));
	})
	
	
    // 移除文本组中的rect标签
    $svgDiv.find("g[pbtype='4'],g[pbtype='7']").find('rect').remove();
    $('svg').removeAttr('pb:pid')
		.removeAttr('xsi:schemalocation')
		.removeAttr('image-rendering')
		.removeAttr('xlink:xid')
		.removeAttr('xmlns:svg')
		.removeAttr('xmlns:pb')
		.removeAttr('xmlns:pbi')
		.removeAttr('xmlns:pbd')
		.removeAttr('xmlns:xsi')
		.removeAttr('onload');
    // 移除带冒号的pd属性
    $('rect,g,polygon,line,polyline,text,path,circle').removeAttr('pb:docmajorversionnum')
    	.removeAttr('pb:docminorversionnum')
    	.removeAttr('pb:docgroup')
    	.removeAttr('pb:wnheight')
    	.removeAttr('pb:wnwidth')
    	.removeAttr('pb:wnstate')
    	.removeAttr('pb:zoom')
    	.removeAttr('pb:type')
    	.removeAttr('pb:namedvalues')
    	.removeAttr('pb:ismultistate')
    	.removeAttr('pb:visible')
    	.removeAttr('pb:lineends')
    	.removeAttr('pb:linestyle')
    	.removeAttr('pb:strikethroughandunderline')
    	.removeAttr('pb:fillcolor')
    	.removeAttr('pb:fillstyle')
    	.removeAttr('pb:backgroundcolor')
    	.removeAttr('pb:tbhandle')
    	.removeAttr('pb:rotation')
    	.removeAttr('pb:flip')
    	.removeAttr('pb:scripting')
    	.removeAttr('pb:archeight')
    	.removeAttr('pb:arcleft')
    	.removeAttr('pb:arcwidth')
    	.removeAttr('pb:arctop')
    	.removeAttr('pb:endangle')
    	.removeAttr('pb:linecolor')
    	.removeAttr('pb:startangle')
    	.removeAttr('pb:endpoints')
    	.removeAttr('pb:arcleft')
    	.removeAttr('pb:localid')
    	.removeAttr('pb:displayservertimezone')
    	.removeAttr('pb:displaypointname')
    	.removeAttr('pb:displaytimestamp')
    	.removeAttr('pb:showuom')
    	.removeAttr('pb:numberformat')
    	.removeAttr('pbd:pttagname')
    	.removeAttr('pb:persiststring')
    	.removeAttr('pb:pttagtime')
    	.removeAttr('pb:pttagstatus')
    	.removeAttr('pb:pttagvalue')
    	.removeAttr('pbd:property')
    	.removeAttr('pb:flow')
    	.removeAttr('pb:lower')
    	.removeAttr('pb:orientation')
    	.removeAttr('pb:start')
    	.removeAttr('pb:upper')
    	.removeAttr('pb:horzalign')
		
		//后期(小阮)添加
		.removeAttr('pb:originalstyle');
		
		
		//后期(小阮)添加,移除链接中的pb属性
		$('a').removeAttr('pb:buttonaction')
    		.removeAttr('pb:buttonrelativepath')
    		.removeAttr('pb:buttontype')
    		.removeAttr('pb:type')
    		.removeAttr('pb:visible')
    		.removeAttr('pb:buttonoptions')
    		.removeAttr('pb:workingdirectory')
			.removeAttr('xlink:href');
         
		 //后期（小阮添加） ，pbtype=7为测点值，添加标志位
		var regStr = /\\{2}.+\\{1}/g;
		$svgDiv.find("g[pbtype='7']").each(function(i, item){
		var $item = $(item);
		var tagName = $item.attr("pbdpttagname").replace(regStr,"").toUpperCase();
		$item.find('text').attr('id', 'tagTextVal__' + tagName)
			.attr('type', 'tagTextVal').attr('tagname', tagName)
			.text("--");
		});
		 
		// 找到状态位 后期（小阮）修改
		$svgDiv.find("[pbismultistate='True']").each(function(i, item){
	
			var $item = $(item);
			var pbdpttagname = $item.attr("pbdpttagname");
			pbdpttagname = pbdpttagname ? pbdpttagname : $item.find("pb\\:multistate").attr("pbd:pttagname"); 
			
			//测点数据有问题的颜色
			var ColorBadData = $item.find("pb\\:multistate").attr("ColorBadData"); 
			
			//开关量切换的颜色代码
			var firstColor;
			var secondColor;
			$item.find("pb\\:MSState").each(function(j,temp) {
				if(j == 0)
					firstColor = $(temp).attr("Color");
				else if (j==1) 
					secondColor = $(temp).attr("Color");
			})
			
			if (pbdpttagname) {
				var tagName = pbdpttagname.replace(regStr,"").toUpperCase();
				
				//分割Pi地址和测点
				var temp = pbdpttagname.split("\\");
			
				if (tagName && tagName != "") {
					$item.attr('id', 'tagTextVal__' + tagName)
						.attr('type', 'pb_multistate').attr('tagname', tagName)
						.attr('piservice',temp[2])
						.attr('firstColor',firstColor)
						.attr('secondColor',secondColor);
					$item.attr('ColorBadData', ColorBadData);
				}
			}
		});
		
		//（小阮）添加  柱状图  
		$svgDiv.find("svg[id$='_HashMarks']").remove();
		
		$svgDiv.find("g[id^='Bar']").each(function(i,item) {
			var pbdpttagname = $(item).attr('pbdpttagname');
			pbdpttagname = pbdpttagname ? pbdpttagname : $item.find("pb\\:multistate").attr("pbd:pttagname"); 
			
			if (pbdpttagname) {
				var tagName = pbdpttagname.replace(regStr,"").toUpperCase();
				
				//分割Pi地址和测点
				var temp = pbdpttagname.split("\\");
			
				if (tagName && tagName != "") {
				
				$(item).attr('piservice',temp[2])
					.attr('pointname',temp[3]);
				}
			}
		})
		 
		 //后期（小阮添加）找到测点的位置，为其添加pi数据库地址和测点名
		$("g[pbtype='7']").each(function(i, item){
			//分割Pi地址和测点
			var temp = $(item).attr('pbdpttagname').split("\\");
			//给测点的文本域添加pi地址和测点名标识,添加点击事件和onmouseover事件
			$(item).find('text').attr('piservice',temp[2])
				.attr('pointname',temp[3])
				.attr('onclick','showMessage(this)');
		});
		
		 $('pb\\:multistate').remove(); 
		
		//后期（小阮）添加
// 		var html = '';
// 		html = html + "<script language='JavaScript' xlink:href='jquery-2.1.3.min.js' xlink:type='simple' xlink:show='other' xlink:actuate='onLoad'>" +　  "<\/script>";
// 		html = html + "<script language='JavaScript' xlink:href='svg.js' xlink:type='simple' xlink:show='other' xlink:actuate='onLoad'>" +　  "<\/script>";
// 		$('defs').html(html);
		 $.modal.alert("转换成功！");
		//showSuccessMessage();
	
		var eleLink= document.createElement('a');
		eleLink.download = fileName;
		eleLink.style.display='none';
		
		var blob=new Blob([$('#id1').html()]);
		eleLink.href=URL.createObjectURL(blob);
		document.body.appendChild(eleLink);
		eleLink.click();
		document.body.removeChild(eleLink);
          
        }
        </script>
</body>
</html>